<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

<ui:composition>
	<style>
.optionList {
	height: 22px;
}

.vertical-menu-cell {
	padding: 0px 4px 0px 4px;
}
</style>
	<h:panelGrid styleClass="vertical-menu-cell" columnClasses="optionList"
		columns="1" cellspacing="0" cellpadding="0">
		<rich:dropDownMenu
			style="border:1px solid #{a4jSkin.panelBorderColor}" label="Option1"
			mode="client" jointPoint="topRight" direction="bottomRight">
			<rich:menuItem label="Suboption 1-1" />
			<rich:menuItem label="Suboption 1-2">
				<f:facet name="icon">
					<h:graphicImage value="/images/icons/print.gif" />
				</f:facet>
			</rich:menuItem>
			<rich:menuItem label="Suboption 1-3" />
		</rich:dropDownMenu>
		<rich:dropDownMenu jointPoint="topRight" direction="bottomRight"
			style="border:1px solid #{a4jSkin.panelBorderColor}" label="Option2"
			mode="client">
			<rich:menuItem label="Suboption 2-1" />
			<rich:menuItem label="Suboption 2-2" />
			<rich:menuGroup label="Group2">
				<rich:menuItem label="Suboption 2-2-1" />
				<rich:menuItem label="Suboption 2-2-2" />
			</rich:menuGroup>
			<rich:menuItem label="Suboption 2-3" />
		</rich:dropDownMenu>
		<rich:dropDownMenu jointPoint="topRight" direction="bottomRight"
			style="border:1px solid #{a4jSkin.panelBorderColor}" label="Option3"
			mode="client">
			<rich:menuItem label="Suboption 3-1" />
			<rich:menuItem label="Suboption 3-2" />
			<rich:menuItem label="Suboption 3-3" />
		</rich:dropDownMenu>
	</h:panelGrid>
</ui:composition>

</html>